<template>
<div class="page_list" ref="page_list" v-loading='loading' element-loading-background="rgba(0, 0, 0, 0.5)" element-loading-text="正在加载">
  <search @change='change' @changeType='changeType'/>
  <div class="zhan"></div>
  <van-pull-refresh class="refresh_div" v-model="refreshing" @refresh="onRefresh">
    <van-list
      v-model="loading"
      :finished="finished"
      finished-text="没有更多了"
      class="list_div"
      @load="onLoad"
    >
      <div class="list_item" v-for="(item,index) in list" :key="index" @click="toDetail(item)">
        <div class="flex_sb" v-if="isC">
          <div class="item_logo" >
            <img :src="item.logo" alt="">
          </div>
          <div class="info_div">
            <div class="big_t">{{item.company_name}}</div>
            <div class="small_t line_text"><img src="~@/assets/address.png" alt=""> {{item.address}}</div>
            <div class="small_t ">{{item.register_time_str}} <span class="biao_div">成立</span> </div>
          </div>
          <div class="fen_div">{{item.score}}</div>
        </div>
        <div v-if="isC" class="big_t m_b4">法人代表：{{item.legal}}</div>
        <div v-if="isC" class="big_t">注册资金：{{item.register_money || '-'}}</div>
        <div v-if="!isC" class="big_t m_b4">{{item.news_title}}</div>
        <div v-if="!isC" class="small_t">投资金额：{{item.money || '-'}}</div>
      </div>
    </van-list>
  </van-pull-refresh>
  <back />
</div>
</template>
<script>
import search from '../components/search1.vue'
import {comDetail,companylist} from '@/api/api'
import back from '../components/back.vue'

export default {
  components: { search,back },
  data(){
    return{
      list: [],
      loading: false,
      finished: false,
      refreshing: false,
      query:{
        keywords:'',
        chain_id:'',
        city_id:'',
        page:0
      },
      top:0,
      isC:true
    }
  },
  created(){

  },
  activated(){
    this.$refs.page_list.scrollTop =  this.top 
  },
  methods:{
    changeType(type){
      this.isC = type
      this.query.page = 0
      this.finished = false
      this.onLoad()
    },
    onLoad(){
      this.query.page += 1
      this.loading = true
      let api = this.isC?companylist:comDetail.GetCompanyRongziHistory
      api({...this.query,label_id:this.isC?121506:''}).then(res=>{
        if(res.data.length==0){
          this.loading = false
          this.finished = true
          this.refreshing = false
          this.list = []
          return
        }
        if(this.query.page==1){
          this.list = res.data.data
        }else{
          this.list = this.list.concat(res.data.data)
        }
        this.loading = false
        this.refreshing=false
        if(res.data.per_page<=this.query.page){
          this.finished = true
        }
      })
    },
    change(query){
      this.finished = false
      this.query = query
      this.query.page = 0
      this.list = []
      this.onLoad()
    },
    onRefresh() {
      this.finished = false;
      this.query.page = 0
      this.onLoad();
    },
    toDetail(item){
      if(this.isC){
        this.top = this.$refs.page_list.scrollTop
        this.$router.push({name:'companyDetail',query:{identification:item.identification}})
      }else{
        window.open(item.news_href)
      }
    }
  }
}
</script>
<style lang="scss" scoped>
.zhan{
  height: 140px;
  width: 100%;
}
.m_b4{
  margin-bottom: 4px;
  margin-top: 4px;
}
.page_list{
  height: 100%;
  overflow: auto;
  background: #f3f3f3;
}
.list_item{
  width: calc(100% - 20px);
  margin: 10px 10px;
  background: #fff;
  border-radius: 8px;
  padding: 10px;
  .item_logo{
    max-width: 60px;
    min-width: 60px;
    img{
      width: 100%;
    }
  }
  .big_t{
    font-size: 16px;
    color: #111;
  }
  .info_div{
    width: calc(100% - 110px);
    .small_t{
      font-size: 14px;
      margin:4px 0;
      img{
        width: 20px;
        position: relative;
        top: 4px;
      }
      .biao_div{
        background: #ff9933;
        color: #fff;
        font-size: 12px;
        height: 14px;
        border-radius: 2px;
        padding: 1.5px 4px;
        margin-left: 4px;
      }
    }
  }
  .fen_div{
    width: 30px;
    height: 30px;
    text-align: center;
    line-height: 30px;
    background: #ff9933;
    color: #fff;
    font-size: 17px;
    border-radius: 15px;
  }
}
</style>